<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta name="renderer" content="webkit">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="x-ua-compatible" content="IE=edge,chrome=1">
    <title>协同平台商脉圈运营者管理系统-公告列表</title>

    <!--CSS-->
    <link rel="stylesheet" href="css/reset.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css">
    <link rel="stylesheet" type="text/css" href="css/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="css/animate.css">
    <link rel="stylesheet" type="text/css" href="css/base.css">

    <!-- HTML5 shim and Respond.js for IE8 support HTML5 elements and media queries-->
    <!--[if lt IE 9]>
    <script src="js/libs/html5shiv.min.js"></script>
    <script src="js/libs/respond.min.js"></script>
    <![endif]-->
</head>

<body class="overflow-x-h">
<div class="container animated fadeInRight">

    <!--breadcrumb-->
    <ol class="breadcrumb">
        <li>公告管理</li>
    </ol>

    <!--filter-->
    <form role="form" class="filter-box">
        <div class="col-lg-3 col-sm-4">
            <label class="pull-left input-key">公告标题</label>
            <input type="text" class="form-control pull-left" placeholder="请输入公告标题"/>
        </div>
        <div class="col-lg-3 col-sm-4">
            <label class="key">状态</label>
            <select class="select-value">
                <option value="">显示</option>
                <option value="">不显示</option>
                <option value="">待审核</option>
            </select>
        </div>
        <div class="col-lg-6 col-sm-6 btn-wrap">
            <button type="button" class="btn pull-right search-btn">查询</button>
        </div>
        <div class="clearfix"></div>
    </form>

    <!--table list-->
    <div class="panel panel-default">
        <div class="panel-heading">
            <a href="notice-add.html" class="btn add-btn" target="iframe">发公告</a>
            <button type="button" class="btn batch-on-btn" data-toggle="leastOne" data-target="themeId" data-txt="公告上架成功">批量上架</button>
            <button type="button" class="btn batch-off-btn" data-toggle="leastOne" data-target="themeId" data-txt="公告下架成功">批量下架</button>
        </div>
        <div class="panel-body">
            <table class="table table-stripe table-hover">
                <thead>
                <tr>
                    <th>
                        <div class="checkbox"><label><input type="checkbox" data-toggle="checkbox" data-target="themeId">全选</label></div>
                    </th>
                    <th>ID</th>
                    <th>公告标题</th>
                    <th>状态</th>
                    <th>发布时间</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody>
                <tr>
                    <td>
                        <div class="checkbox"><label><input type="checkbox" name="themeId"> </label></div>
                    </td>
                    <td>1</td>
                    <td class="td-ellipsis">九度九度九度九度九度九度九度度九度九度九度</td>
                    <td>不显示</td>
                    <td>2020-2-28</td>
                    <td>
                        <a href="notice-detail.html" class="btn table-btn-operate btn-detail" target="iframe">详情</a>
                        <a href="javascript:;" class="btn table-btn-operate btn-off" data-target="#off" data-toggle="modal">下架</a>
                        <a href="notice-edit.html" class="btn table-btn-operate btn-edit" target="iframe">编辑</a>
                        <a href="javascript:;" class="btn table-btn-operate btn-delete" data-target="#delete" data-toggle="modal">删除</a>
                    </td>
                </tr>
                <tr>
                    <td>
                        <div class="checkbox"><label><input type="checkbox" name="themeId"> </label></div>
                    </td>
                    <td>1</td>
                    <td class="td-ellipsis">九度九度九度九度九度九度九度度九度九度九度</td>
                    <td>不显示</td>
                    <td>2020-2-28</td>
                    <td>
                        <a href="notice-detail.html" class="btn table-btn-operate btn-detail" target="iframe">详情</a>
                        <a href="javascript:;" class="btn table-btn-operate btn-on" data-target="#on" data-toggle="modal">上架</a>
                        <a href="notice-edit.html" class="btn table-btn-operate btn-edit" target="iframe">编辑</a>
                        <a href="javascript:;" class="btn table-btn-operate btn-delete" data-target="#delete" data-toggle="modal">删除</a>
                    </td>
                </tr>
                </tbody>
            </table>

            <!--page-->
            <nav class="page text-center">
                <div class="total pull-left">共<span>10</span>页/<span>100</span>条数据</div>
                <ul class="pagination">
                    <li><span>首页</span></li>
                    <li><a href="#">&laquo;</a> </li>
                    <li><a href="#">1</a> </li>
                    <li><a href="#">2</a> </li>
                    <li><a href="#">...</a> </li>
                    <li><a href="#">4</a> </li>
                    <li><a href="#">5</a> </li>
                    <li><a href="#">&raquo;</a> </li>
                    <li><span>尾页</span></li>
                </ul>
            </nav>
        </div>
    </div>
</div>

<!--delete-modal-->
<div class="modal fade alert-modal" id="delete">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">提示</h4>
            </div>
            <div class="modal-body">
                <p class="text-center">确认删除所选公告？</p>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>
</div>

<!--on-modal-->
<div class="modal fade alert-modal" id="on">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">提示</h4>
            </div>
            <div class="modal-body">
                <p class="text-center">公告上架成功</p>
            </div>
        </div>
    </div>
</div>

<!--off-modal-->
<div class="modal fade alert-modal" id="off">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">
                    <span aria-hidden="true">&times;</span>
                </button>
                <h4 class="modal-title">提示</h4>
            </div>
            <div class="modal-body">
                <p class="text-center">公告下架成功</p>
            </div>
        </div>
    </div>
</div>

<script src="js/libs/jquery-1.12.1.min.js"></script>
<script src="js/libs/bootstrap.min.js"></script>
<script src="js/libs/slimscroll.min.js"></script>
<script src="js/base.js"></script>
</body>
</html>